<!--
 * @Author: Neko
 * @Date: 2021-04-09 10:21:33
 * @LastEditTime: 2021-06-24 16:54:29
 * @LastEditors: Neko
-->
<template>
  <view class="order_price_info_com">
    <view class="info_item">
      <view class="name">{{ $t('locales.totalAmountOfGoods') }}</view>
      <view class="val red">{{$store.getters.currency}} {{ value.totalBig || value.goodsTotal || 0 }}</view>
    </view>
    <view class="info_item">
      <view class="name">{{ $t('locales.freight') }}</view>
      <view class="val red">+ {{$store.getters.currency}} {{ value.fareBig || 0 }}</view>
    </view>
    <view class="info_item" v-if="type === ''">
      <view class="name">{{$t('locales.orderRemarks')}}</view>
      <view class="val"
        ><u-input @blur="inputBlur" height="40" maxlength="100" :placeholder="$t('locales.remarksMsg')"
      /></view>
    </view>
    <!-- <view class="info_item">
			<view class="name">{{$t('locales.preferentialAmount')}}</view>
			<view class="val">- {{$store.getters.currency}} {{value.couponPriceBig || 0}}</view>
		</view> -->
		<view class="info_item" v-if="type !== ''">
			<view class="name">{{$t('locales.totalOrderAmount')}}</view>
			<view class="val red">{{$store.getters.currency}} {{value.paymentPrice || 0}}</view>
		</view>
  </view>
</template>

<script>
export default {
  props: {
    value: {
      type: Object,
      default: () => {}
    },
    type: {
      type: String,
      default: ''
    },
    change: {
      type: Function,
      default: () => {}
    }
  },
  data() {
    return {}
  },
  methods: {
    inputBlur(val) {
      this.$emit('change', {remarks: val})
    }
  }
}
</script>

<style lang="scss" scoped>
.order_price_info_com {
  // margin-top: 20rpx;
  background-color: #fff;
  border-radius: 16rpx;
  padding: 20rpx 0;
  .title {
    padding: 20rpx 30rpx;
    border-bottom: 1px solid #eee;
  }
  .info_item {
    display: flex;
    min-height: 80rpx;
    padding: 20rpx 40rpx;
    .name {
      width: 180rpx;
    }
    .val {
      text-align: right;
      flex: 1;
    }
    .red {
      color: #f12c20;
      font-weight: 700;
    }
  }
}
</style>
